<template>
	<view :class="ctype == 0 ? 'info' : 'info2'">
		<!-- 富文本详情(首页) wwl -->
		<u-parse :html="info.content"></u-parse>
		<view v-if='ctype == 5'>
			<view class="http1" @click="ricsubordinate()" :class="transformsize == 1 ? 'suofang1' : 'suofang2'">
					<image  src="https://tuzhuang-1304727035.file.myqcloud.com/tinymce/images/e76cbb64e66fcc3912e72415c45cfdb162cd092fcbbd2.png" mode="scaleToFill" style="width: 60%;height:100rpx;margin-left: 20%;"></image>
			</view>
			<view class="http2" >
				<view class="http3" @click="ricsubordinate()"  :class="transformsize == 1 ? 'suofang1' : 'suofang2'">
					<image  src="https://tuzhuang-1304727035.file.myqcloud.com/tinymce/images/e76cbb64e66fcc3912e72415c45cfdb162cd092fcbbd2.png" mode="scaleToFill" style="width: 60%;height: 100rpx;margin-left: 20%;"></image>
				</view>
			</view>
			<view class="mobile" @click="onChatphone('13283539597')"  :class="transformsize == 1 ? 'suofang1' : 'suofang2'">
				<image  src="https://tuzhuang-1304727035.file.myqcloud.com/tinymce/images/3a13ba3385c4acbaa5602a8116791c8862cd5f37f222b.png" mode="scaleToFill" style="width: 70px;height: 70px;"></image>
			</view>
		</view>
		<foot v-if='ctype != 5'/>
		<view class="bottom_box" v-if='type == "swiperDetail"'>
			<view class=""  @click="onOperation(1,info.is_like == 1 )">
				<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/YDvHTYdV40Mr0Mes4DJXg1jvsLNjQROx8BQKkLFq.png" mode="scaleToFill"  v-if="info.is_like == 1"></image>
				<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/lSK7pXE39wJeV96F13U88TjgX1x27kMYFehTvmxP.png" mode="scaleToFill" v-else></image>
				<text>{{info.like}}</text>
			</view>
			<view class="" @click="onOperation(2,info.is_collect == 1 )">
				<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/GKE0onhRAublBcECEMLlS2nmNNbLUClCpsTf1UVq.png" mode="scaleToFill"  v-if="info.is_collect == 1"></image>
				<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/UqCVIBO5Y4YcmClAqexlQz6jFzsfp7sT3HQv0Jm9.png" v-else></image>
				<text>{{info.collect}}</text>
			</view>
			<view class=""  @click="onOperation(3)">
				<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/y3es35peNBbC1bpkQQTfqsMPEjsLdlHTbJW14Nr9.png" mode=""></image>
				<text>{{info.transmit}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {setLikeCollection} from "@/utils/postRequest.js"
	import  uParse from '@/components/u-parse/u-parse.vue'
	import {getFwb} from '@/utils/getRequest.js'
	import { getHomeCarouselMessage } from './static/api.js'
	var timer = null; //创建一个定时器
	export default{
		components:{uParse},
		data(){
			return{
				info:{},
				type:'',
				ctype:0,
				loading:false,
				transformsize:1,
				upDataMsg: null,
				upDataMsgs: null,
				animation:'',
				animationData: {},
				isStop:true
			}
		},
		methods:{
			// 定义动画内容
		    scaleAndScale() {
		        // 定义动画内容
		  //       this.animation.scale(1.2, 1.2).step(); //先放大1,2倍
				// console.log('是否进入动画2')
		  //       this.animation.scale(1, 1).step(); //缩小至原来的大小
		  //       // 导出动画数据传递给data层
				
		  //       this.animationData = this.animation.export(); //每次执行导出动画时 会覆盖之前的动画
				// console.log(this.animationData,'是否进入动画3')
				this.animation.scaleX(1.2).scaleY(1.2).step()
				this.animation.scaleX(1).scaleY(1).step()
				this.animationData = this.animation.export()
		    },
		    noscaleAndScale() {
				this.animationData = {};
		        // this.animation.scale(1, 1).step()
		        // this.animationData = this.animation.export()
		    },
			onChatphone(phone){
				// #ifdef APP-PLUS
				
				
				plus.android.requestPermissions(
					["android.permission.CALL_PHONE"], 
					function(resultObj) {
						var result = 0;
						for (var i = 0; i < resultObj.granted.length; i++) {
							var grantedPermission = resultObj.granted[i];
							console.log('已获取的权限：' + grantedPermission);
							result = 1
						}
						for (var i = 0; i < resultObj.deniedPresent.length; i++) {
							var deniedPresentPermission = resultObj.deniedPresent[i];
							console.log('拒绝本次申请的权限：' + deniedPresentPermission);
							result = 0
						}
						for (var i = 0; i < resultObj.deniedAlways.length; i++) {
							var deniedAlwaysPermission = resultObj.deniedAlways[i];
							console.log('永久拒绝申请的权限：' + deniedAlwaysPermission);
							result = -1
						}
						console.log(result);
						if(result == 1){
							uni.makePhoneCall({
								 phoneNumber: phone.toString(),//电话号码
								success(ress) {
									console.log("拨打电话成功",ress)
								},
								fail(err) {
									console.log("拨打电话失败",'err')
								}
							});
						}else{
							uni.showToast({
								title:"请开启拨号权限",
								icon:"error",
							})
						}
					},
					function(error) {
						console.log('申请权限错误：' + error.code + " = " + error.message);
					}
				);
				// #endif
				// #ifdef MP-WEIXIN
				uni.makePhoneCall({
					phoneNumber:phone.toString(),//电话号码
					success:function(e){
						console.log(e,'成功');
					},
					fail:function(e){
						console.log(e,'失败');
				 
					}
				})
				// #endif
			},
			async ricsubordinate(){
				uni.navigateTo({
					url:'/pagesHome/rTextDsubordinate'
				})
			},
			async onOperation(type, flag) {
				if(!this.$store.getters.userInfo){
					return this.$global.getUserInfo()
				}
				if (type != 3) {
					if (this.loading) return
					this.loading = true
					try {
						var res = await setLikeCollection({
							flag: flag,
							status: type,
							id: this.info.id,
							type: 5
			
						})
						this.loading = false
						if (type == 1) {
							if (flag) {
								this.info.is_like = 2
								this.info.like = Number(this.info.like) - 1
							} else {
								this.info.is_like = 1
								this.info.like = Number(this.info.like) + 1
							}
						} else {
							if (flag) {
								this.info.is_collect = 2
								this.info.collect = Number(this.info.collect) -1
							} else {
								this.info.is_collect = 1
								this.info.collect = Number(this.info.collect) + 1
							}
						}
			
					} catch {
						uni.showToast({title:'操作失败',icon:'none'})
						this.loading = false
					}
				} else {
					uni.navigateTo({
						url:'/pagesHome/poster?id=' + this.info.id
					})
				}
			
			},
			
			async getInfo(id){
				uni.showLoading()
				try{
					var res = await getHomeCarouselMessage({jump_id:id})
					this.info = res
					uni.hideLoading()
					uni.hide
				}catch{}
			},
			async getFwbInfo(id){
				uni.showLoading()
				try{
					var res = await getFwb({id})
					this.info = res
					uni.hideLoading()
				}catch{
					uni.hideLoading()
				}
				
			}
		},
		onShow(){
			// 初始化一个动画
   //          var animation = uni.createAnimation({
   //              transformOrigin: "50% 50% 0",  
   //              duration: 2000,  //动画持续
   //              timingFunction: 'linear',  //linear 全程匀速运动
   //              delay:0  //延迟两秒执行动画
   //          })
   //          this.animation = animation;
			
			// this.animation.scale(1.2, 1.2).step(); //先放大1,2倍
			// this.animation.scale(1, 1).step(); //缩小至原来的大小
			// // 导出动画数据传递给data层
			// console.log(this.animation,'是否进入动画方法')
			// this.animationData = this.animation.export();
			// console.log(this.animationData,'是否进入动画方法')
			// console.log(timer,'清除定时器aaa-')
			// console.log(this.animation,'清除定时器bbb-')
			// console.log(this.isStop,'清除定时器ccc')
			
			var animation = uni.createAnimation({
			      duration: 400,
			        timingFunction: 'linear',
			    })
			
			    this.animation = animation
			
			// animation.scaleX(1.2).scaleY(1.2).step(); //先放大1,2倍
			// animation.scaleX(1).scaleY(1).step(); //缩小至原来的大小
			
			    // this.animationData = animation.export()
				
			if(this.upDataMsgs != null){
				this.upDataMsgs = setInterval(()=>{
					console.log(this.upDataMsgs,'清除定时器bbb')
					
					this.noscaleAndScale()
				},1200);
			}
			
			if(this.upDataMsgs != null){
				this.upDataMsg = setInterval(()=>{
					console.log(this.upDataMsg,'清除定时器ccc')
					this.scaleAndScale()
				}, 1200);
			}
			
			
			
			this.upDataMsgs = setInterval(()=>{  //创建定时器,1秒执行异一次
				if(this.transformsize == 1){
					this.transformsize = 2;
				}else if(this.transformsize == 2){
					this.transformsize = 1;
				}
			    
			},800);
			
            // if (this.isStop) {
            //     // 使用动画
            //     this.scaleAndScale()
            //     timer = setInterval(()=>{  //创建定时器,1秒执行异一次
            //         this.scaleAndScale()
            //     },4000)
            // } else {
            //     this.noscaleAndScale()
            // }
						
						
						
			var option = this.$global.$editUploadBack(4, 'richTextDetails')
			if(option && option.id && this.info.id == option.id && option.count)  this.info.transmit = this.info.transmit + Number(option.count)
		},
		onHide() { //在页面隐藏时也要清除定时器  
			if(this.upDataMsg){
					clearInterval(this.upDataMsg);
					this.upDataMsg= null;
				}
			if(this.upDataMsgs){
					clearInterval(this.upDataMsgs);
					this.upDataMsgs= null;
				}
	    },
	    onUnload(){ //在页面卸载时清除定时器 避免出现多个定时器连续创建动画
	        if(this.upDataMsg){
	        		clearInterval(this.upDataMsg);
	        		this.upDataMsg= null;
	        	}
			if(this.upDataMsgs){
					clearInterval(this.upDataMsgs);
					this.upDataMsgs= null;
				}
	    },
		onBackPress(e){
			if(e.from == 'backbutton'){
				//APP安卓物理返回键
				clearInterval(this.upDataMsg)
				this.upDataMsg = null;
				clearInterval(this.upDataMsgs);
				this.upDataMsgs= null;
			}else{
				//H5导航按键返回
				clearInterval(this.upDataMsg)
				this.upDataMsg = null;
				clearInterval(this.upDataMsgs);
				this.upDataMsgs= null;
			}
		},
				
		onLoad(params){
			this.type = params.type
			if(params.title){
				uni.setNavigationBarTitle({
				  title: params.title 
				})
			}
			if(params.type=='typeClick'){
				this.info.content = uni.getStorageSync('gonyishuoming');
				return
			};
			if(params.type == 'swiperDetail' || params.type == 5){
				if(params.type == 5) this.ctype = params.type;
				this.getInfo(params.id)
			}else{
				this.getFwbInfo(params.type)
			}
			
		}
	}
</script>

<style lang="scss">
	.suofang1{
		transform: scale(1.2, 1.2); 
		transition: -webkit-transform 600ms linear 0ms, transform 600ms linear 0ms; 
		transform-origin: 50% 50% 0px;
	}
	.suofang2{
		transform: scale(1, 1); 
		transition: -webkit-transform 600ms linear 0ms, transform 600ms linear 0ms; 
		transform-origin: 50% 50% 0px;
	}
	.mobile{
		position: fixed;
		    right: 0;
		    bottom: 20%;
		    width: 70px;
		    height: 70px;
	}
	.http1{
		position: absolute;
		top: 1268rpx;
		    width: 100%;
		    height: 120rpx;
			    // margin-left: 20%;
	}
	.http2{
		position: relative;
	}
	.http3{
		position: absolute;
		    bottom: 44rpx;
			width: 100%;
			height: 120rpx;
			    // margin-left: 20%;
	}
	.info{
		// padding: 30rpx 38rpx;
		padding: 30rpx 38rpx 200rpx;
		width: 100%;
		box-sizing: border-box;
		font-size: 28rpx;
		line-height: 40rpx;
		color:#333;
	}
	.info2{
		width: 100%;
		box-sizing: border-box;
		font-size: 28rpx;
		line-height: 40rpx;
		color:#333;
	}
	.bottom_box{
		position:fixed;
		bottom:0;
		left: 0;
		right: 0;
		background-color: #fff;
		padding: 36rpx;
		box-sizing:border-box;
		display:flex;
		align-items:center;
		view{
			flex:1;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center;
			&:nth-child(1){
				justify-content: flex-start;
			}
			&:nth-child(3){
				justify-content: flex-end;
			}
		}
		image{
			width: 44rpx;
			height: 44rpx;
			margin-right: 9rpx;
		}
		text{
			font-size: 28rpx;
			line-height: 44rpx;
			color:#A4A4A4;
		}
	}
</style>
